<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>提交订单</title>
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/swiper.min.css">
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/mui.css?v=1">
		<link rel="stylesheet" type="text/css" href="__API__/lib/css/mobileSelect.css" />
		<link rel="stylesheet" href="__API__/lib/css/style.css">
		<script type="text/javascript" src="__API__/lib/js/jquery-1.11.0.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/mui.js"></script>
		<script src="__API__/lib/js/mobileSelect.js" type="text/javascript" charset="utf-8"></script>
		<script src="__API__/lib/js/city.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="__API__/lib/js/swiper.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/vue.min.js"></script>
		<script type="text/javascript" src="__API__/lib/js/common.js"></script>
		<script type="text/javascript" src="__API__/lib/js/index.js"></script>
	<script src="https://cdn.staticfile.org/axios/0.18.0/axios.min.js"></script></head>

	<body>
		<div class="order_info bg_color" id="app">
			<div class="confirmorders">
				<div class="addaddress">
					<div class="icon"><img src="__API__/lib/images/address.png" alt=""></div>
					<div v-if="!address || address == ''" class="jump xzaddress" @click="goDetail('add_address.html')">+
						添加地址</div>
					<div v-else @click="openAddress()">
						<p><span>收件人：{{address.name}} </span><span>{{address.mobile}}</span></p>
						<p>地址：{{address.address}}</p>
					</div>
				</div>
				<div class="confirmorders_info">
					<h2>商品清单</h2>
					<ul class="search_list">
						<li v-for="(item,i) in orderList" :key="i">
							<div class="img"><img :src="item.single_pic" alt=""></div>
							<div class="info">
								<div class="left">
									<h3>{{item.title}}</h3>
									<span>{{item.type_title}}</span>
									<div class="info_bot">
										<p class="price">￥{{item.price}}</p><span class="num">x{{item.number}}</span>
									</div>
								</div>
							</div>
						</li>
					</ul>
				</div>
				<div class="confirmorders_con">
<!--					<div class="confirmorders_bot">-->
<!--						<span>运费</span>-->
<!--						<p class="redprice">￥{{freight}}</p>-->
<!--					</div>-->
					<div class="confirmorders_bot text_box">
						<textarea v-model="reason" placeholder="请输入备注"></textarea>
					</div>
				</div>
			</div>
			<div class="footercart">
				<div class="footercart_left confirmfoot_left">
					<p>总价格：<span class="red_color">￥{{totalPrice}}</span></p>
					<p>共有<span class="red_color">{{totalNum}}</span>件商品</p>
				</div>
				<div class="footercart_right confirmfoot_right">
					<div class="blue_bg foot_btn" @click="openPay()">支付</div>
				</div>

			</div>
			<!-- 选择地址弹窗 -->
			<div class="addcartmask address_mask" v-if="isAddress" @click="cancelMask()">
				<div class="address_mask_box" @click.stop>
					<div class="m_head">
						<h2>选择收货地址</h2>
						<span class="close" @click="cancelMask()"><img src="__API__/lib/images/close.png"></span>
					</div>
					<ul class="address_list">
						<li :class="{'active': addressIndex == i}" v-for="(item,i) in addressList" :key="i" @click="chooseAddress(i)">
							<div class="icon"><img src="__API__/lib/images/address.png" alt=""></div>
							<div class="right">
								<p><span>收件人：{{item.name}} </span><span>{{item.mobile}}</span></p>
								<p>地址：{{item.address}}</p>
							</div>
						</li>
					</ul>
				</div>
			</div>
			<!-- 支付弹窗 -->
			<div class="addcartmask pay_mask" v-if="isPay" @click="cancelMask()">
				<div class="pay_mask_box" @click.stop>
					<ul class="pay_list">
						<li>
							<div class="mui-input-row mui-radio ">
								<label><img src="__API__/lib/images/pay2.png" alt="">购物积分支付
									<span>￥{{integral_price}}</span></label>
								<input name="payRadio" type="radio" value="0" v-model="payCheck" />
							</div>
						</li>
						<li>
							<div class="mui-input-row mui-radio ">
								<label><img src="__API__/lib/images/pay1.png" alt="">微信支付</label>
								<input name="payRadio"  type="radio" value="1" v-model="payCheck" checked />
							</div>
						</li>
					</ul>
					<div class="form_submit">
						<div class="grey_bg" @click="cancelMask()">取消</div>
						<div class="blue_bg" @click="nowpay()">确定</div>
					</div>
				</div>
			</div>
		</div>
		<script>

			WeixinJSBridge.invoke(
					'getBrandWCPayRequest', '{$data}'
					function(res){
						if(res.err_msg == "get_brand_wcpay_request:ok" ){
							common.openUrl('pay_success.html' );
							// 使用以上方式判断前端返回,微信团队郑重提示：
							//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
						}
					});

		</script>

<!--		<script type="text/javascript">-->
<!--			//调用微信JS api 支付-->

<!--			function onBridgeReady(){-->
<!--				WeixinJSBridge.invoke(-->
<!--						'getBrandWCPayRequest', {-->
<!--							"appId":"wx2421b1c4370ec43b",     //公众号ID，由商户传入-->
<!--							"timeStamp":"1395712654",         //时间戳，自1970年以来的秒数-->
<!--							"nonceStr":"e61463f8efa94090b1f366cccfbbb444", //随机串-->
<!--							"package":"prepay_id=u802345jgfjsdfgsdg888",-->
<!--							"signType":"MD5",         //微信签名方式：-->
<!--							"paySign":"70EA570631E4BB79628FBCA90534C63FF7FADD89" //微信签名-->
<!--						},-->
<!--						function(res){-->
<!--							if(res.err_msg == "get_brand_wcpay_request:ok" ){-->
<!--								// 使用以上方式判断前端返回,微信团队郑重提示：-->
<!--								//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。-->
<!--							}-->
<!--						});-->
<!--			}-->
<!--			if (typeof WeixinJSBridge == "undefined"){-->
<!--				if( document.addEventListener ){-->
<!--					document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);-->
<!--				}else if (document.attachEvent){-->
<!--					document.attachEvent('WeixinJSBridgeReady', onBridgeReady);-->
<!--					document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);-->
<!--				}-->
<!--			}else{-->
<!--				onBridgeReady();-->
<!--			}-->
<!--		</script>-->
	</body>

</html>
